<template>
  <div>
    <el-card>

      <div>
        姓名:<el-input v-model="inp" placeholder="请输入内容"   @input="search" />
      </div>
      <el-table
        :data="tableData"
        style="width: 100%"
      >
        <el-table-column
          label="序号"
          type="index"
        />
        <el-table-column
          label="姓名"
          prop="name"
        />
        <el-table-column
          label="公司名称"
          prop="company"
        />
        <el-table-column
          label="公司地址"
          prop="city"
        />
        <el-table-column
          label="面试方式"
          prop="way"
        />
        <el-table-column
          label="面试时间"
        >
          <template slot-scope="scope">
            {{ scope.row.time|moment("YYYY-MM-DD HH:mm:ss") }}
          </template>
        </el-table-column>
        <!-- <el-table-column
          label="图片">
          <template slot-scope="scope">
            <img :src="'http://127.0.0.1:3000/images/'+scope.row.lu"  alt="">
          </template>
          </el-table-column> -->
        <el-table-column
          label="面试总结"
          prop="sumup"
        />
        <el-table-column label="操作" width="200px">
          <template slot-scope="scope">
            <el-button @click="xq(scope.row.id)"><a class="blue">详情</a></el-button>
          </template>
        </el-table-column>
      </el-table>

      <el-pagination
        :page-sizes="[5, 10, 15, 20]"
        :page-size="5"
        layout="total, sizes, prev, pager, next, jumper"
        :total="t"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      />

    </el-card>
  </div>
</template>

<script>
export default {
  components: {},
  props: {},
  data() {
    return {
      inp: '',
      tableData: [],
      size: 5,
      page: 1,
      t: 0,
      pageisornot: false

    }
  },
  computed: {},
  watch: {},
  created() {
    this.getmian()
  },
  mounted() {},
  methods: {
    async getmian() {
      console.log(11111111111)
      this.pageisornot = false
      var res = await this.http.get('/replay/replay', {
        params: {
          status: 1,
          page:this.page,
          size:this.size
        }
      })
      if (res.status == 200) {
        var list = []
        res.data.data.forEach(element => {
          if (element.record_src != '无' && element.question != '无') {
            list.push(element)
          }
        })
        this.tableData = list
        this.t = list.length
      }
    },
    async search() {
      console.log(22222222222222)
      if (!this.pageisornot) {
        this.page = 1
      }
      if (this.inp != '') {
          var res = await this.http.get('/replay/replay', {
            params: {
              name: this.inp
            }
          })

          if (res.status == 200){
            var list = []
            res.data.data.forEach(element => {
              if (element.record_src != '无' && element.question != '无') {
                list.push(element)
              }
            })
            this.tableData = list
            this.t = list.length
          }
      }else {
        this.getmian()
      }
      this.pageisornot = true
    },
    handleSizeChange(v) {
      this.size = v
      if (this.pageisornot) {
        this.search()
      } else {
        this.getmian()
      }
    },
    handleCurrentChange(v) {
      this.page = v
      if (this.pageisornot) {
        this.search()
      } else {
        this.getmian()
      }
    },
    xq(id) {
      this.$router.push({ path: '/fupanxq', query: { id: id }})
    },
    // clear() {
    //   console.log(555555555)
    //   this.getmian()
    // },
  }
}
</script>
<style  scoped>
    .el-input{
        width: 200px;
        margin-left: 7px;
    }
    .el-pagination{
      margin-top: 20px;
      text-align: center;
    }
    .el-table .el-button{
      background: 0;
      padding-left: 0;
      padding-right: 0;
      display: inline-block;
      border:0;
    }
    .blue{
        color: blue;
    }
</style>
